import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { viteMockServe } from 'vite-plugin-mock'; 
import postCssPxToRem from 'postcss-pxtorem';

export default defineConfig({
  plugins: [
    vue(),
    //  配置mock数据插件
    viteMockServe({  
      // 设置Mock数据文件的目录  
      mockPath: 'mock',
      // 设置是否开启Mock功能，开发环境下默认开启  
      enable: true,
    })
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  },
  server: {
    // 配置接口代理 解决报错问题
    proxy: {
      '/proxyApi': {
        target: 'http://localhost:3000', // 实际 报端服务API 地址
        changeOrigin: true,
        rewrite: (path:string) => path.replace(/^\/proxyApi/, ''), // 可选，去掉请求路径中的 '/api' 前缀,
        onRequest: (proxyReq:{setHeader:(par1:string,par2:string)=>void}) => {
          // 在发送代理请求前对请求进行修改
          proxyReq.setHeader('X-Custom-Header', 'Custom Value');
        }
      }
    }
  } as any,
  css: {
    postcss: {
      plugins: [
        postCssPxToRem({
            rootValue: 37.5, //根目录font-size 这里写设计稿的宽度/10即可，例如设计稿宽度是750px就写75 (10是根字体 默认大小)
            // vant默认是37.5，如果是使用了vant的话可以像下面这样写
            // rootValue(res) {
            //   return res.file.indexOf("vant") !== -1 ? 37.5 : 75;
            // },
            propList: ['*'], // 需要转换的属性，默认转换所有属性 可以分别配置['font', 'font-size', 'line-height', 'letter-spacing'],
            selectorBlackList: [], // CSS选择器黑名单，防止部分选择器被转换
            exclude: /\/node_modules\//i, // 忽略包文件转换rem
        })
      ] 
    }
  }
})
